import React, { PropTypes } from 'react';
import { bindActionCreators } from 'redux';
import { connect } from 'react-redux';

import Navbar from '../components/nav-top/Navbar.jsx';
import BodyContent from '../components/body-content/BodyContent.jsx';

import * as TodoActions from '../actions';

class App extends React.Component{
  static propTypes: {
    todos: PropTypes.array.isRequired,
    actions: PropTypes.object.isRequired
  }

  setMapHandler(command) {
    
  }

  render() {
    let {todos, actions} = this.props;
    return (
      <div className="wrapper">
        <Navbar addTodo={actions.addTodo} callbackApp={this.setMapHandler.bind(this)} />
        <BodyContent todos={todos} actions={actions} />
      </div>
    );
  }
};

const mapStateToProps = state => ({
  todos: state.todos
})

const mapDispatchToProps = dispatch => ({
  actions: bindActionCreators(TodoActions, dispatch)
})

export default connect(
  mapStateToProps,
  mapDispatchToProps
)(App)








